import React, {Component} from 'react';
import Comment from './page/Comment/Comment';
import Welcome from './page/Welcome/Welcome'
import Counter from './page/Counter/Counter'
import './App.css';
import { BrowserRouter,Route,NavLink   } from 'react-router-dom'

class RouterView extends Component {
    render() {
        return (
               <BrowserRouter>
                   <div>
                   <div className="App-nav">
                       <ul className="App-nav-list">
                           <NavLink exact activeClassName="active" className="App-nav-link" to="/">首页</NavLink>
                           <NavLink exact activeClassName="active" className="App-nav-link" to="/comment">留言板</NavLink>
                           <NavLink exact activeClassName="active" className="App-nav-link" to="/counter">计数器</NavLink>
                       </ul>
                   </div>
                   <div>
                       <Route exact path='/' component={Welcome}/>
                       <Route path='/comment' component={Comment}/>
                       <Route path='/counter' component={Counter}/>
                   </div>
                   </div>
               </BrowserRouter>
        )
    }
}
export default RouterView;
